<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
  <style>
    *{
		margin:0;
		padding:0;
	}
	a{
		text-decoration:none;
	}
	#head{
		width:1200px;
		margin:20px auto;
	}
	#head_jg{
		font-size:12px;
		border:1px solid red;
		padding:10px 35px;
		margin-left:30px;
		display:inline-block;
		position:relative;
		bottom:20px;
		background-color: rgb(255, 239, 239);
		border:rgb(255, 192, 204);
		color:rgb(102, 102, 102);
	}
	#main{
		height:600px;
		background-image:url("img/dlzcbg.png");
	}
	#login{
		padding-bottom:25px;
		width:400px;
		float:right;
		position:relative;
		margin-right:300px;
		margin-top:70px;
		background-color: rgb(255, 236, 235);
		opacity: 0.9;
		/* border:1px solid blue; */
	}
	#login_b{
		height:50px;
		width:100%;
		text-align:center;
		border-bottom:1px solid rgb(204, 204, 204);
	}
	#login_b a{
		width:100px;
		height:40px;
		margin-right:45px;
		line-height:45px;
		margin-top:8px;
		font-size:14px;
		font-weight:bold;
		display:inline-block;
	}
	#tip{
		margin-top:15px;
		width:305px;
		margin-left:50px;
		line-height: 30px;
		color: #ff1877;
		font-size:13px;
		background-color:#fff;
		border:1px solid #ffd797;
		display:none;
	}
	#jgfh{
		width:25px;
		height:25px;
		margin:0 10px -10px 10px;
		background:url("img/gwc.png") no-repeat -333px -710px;
		display:inline-block;
	}
 	.denglub_focus{
		color:rgb(255, 97, 122);
		font-family: "tahoma, arial, sans-serif";
		border-bottom:2px solid rgb(255, 65, 102);
	}
	#shuru{
		display:block;
	}
	#shuru input{
		height:40px;
		width:300px;
		margin-left:50px;
		margin-top:15px;
		background:none;
		padding-left:5px;
		border:1px solid rgb(207, 207, 207);
	}
	#wumi{
		display:block;
	}
	#wumi input{
		padding-left:5px;
	}
	#wumi #wumizh{
		height:40px;
		width:300px;
		margin-left:50px;
		margin-top:15px;
		background:none;
		border:1px solid rgb(207, 207, 207);
	}
	#wumi button{
		height:40px;
		width:110px;
		margin-left:50px;
		margin-top:15px;
		color:#fff;
		background-color:rgb(255, 87, 119);
		border:rgb(255, 87, 119);
	}
	#wumi #wumimima{
		height:40px;
		width:170px;
		margin-left:20px;
		background:none;
		border:1px solid rgb(207, 207, 207);
	}
	#dl{
		height:40px;
		width:306px;
		margin-left:50px;
		margin-top:25px;
		color:#fff;
		background-color:rgb(255, 87, 119);
		border:rgb(255, 87, 119);
	}
	#weixindenglu{
		margin-left:50px;
		margin-top:25px;
	}
	#weixindenglu a{
		color:black;
		font-size:12px;
	}
	#weixindenglu img{
		margin-right:6px;
	}
	#qita{
		margin-left:250px;
		margin-top:25px;
	}
	#qita a{
		font-size:12px;
	}
	#wangji{
		color:rgb(150, 150, 150);
	}
	#mianzhu{
		color:rgb(255, 89, 121);
	}
	#foot{
		height:250px;
		border-top:1px solid rgb(221, 221, 221);
		margin-top:30px;
		/* border:1px solid red; */
		background-color:rgb(250, 250, 250);
	}
	#foot table{
		width:700px;
		height:200px;
	}
	#foot tr{
		font-size:12px;
		color:rgb(102, 102, 102);
	}
	#foot #title{
		font-size:18px;
		font-weight:bold;
	}
	.guanzhu{
		display:inline-block;
	}
	#xinlang{
		height:18px;
		width:20px;
		background:url(img/guanzh.png) no-repeat;
		margin-bottom:-5px;
		margin-right:3px;
	}
	#Qkongjian{
		height:18px;
		width:20px;
		background:url(img/guanzh.png) no-repeat -28px;
		margin-bottom:-5px;
		margin-right:3px;
	}
	#tengxun{
		height:18px;
		width:20px;
		background:url(img/guanzh.png) no-repeat -56px;
		margin-bottom:-5px;
		margin-right:3px;
	}
	#erweima{
		float:right;
		margin-right:80px;
		margin-top:20px;
		text-align:center;
	}
	#erweima1{
		float:right;
		margin-right:100px;
		margin-top:20px;
		text-align:center;
	}
	#foot_ys{
		width:1200px;
		margin:0 auto;
		border-bottom:1px solid rgb(102, 102, 102);
	}
	#footer{
		text-align:center;
		font-size:12px;
		line-height:20px;
		color:rgb(102, 102, 102);
	}
	#footer a{
		color:rgb(102, 102, 102);
	}
	#footer a:hover{
		color:#f36;
	}
	#wumi{
	   display:none;
	}
  </style>
 </head>
 <body>
	<div id="head">
		<a href="shou.html"><img src="img/logo.jpg"/></a>
		<span id="head_jg">
			依《网络安全法》相关要求，即日起美丽说会员登陆需绑定手机。
			为保障您的账户安全及正常使用，如您尚未绑定，请尽快完成绑定，感谢您的理解和支持!
		</span>
	</div>
	<div id="main">
		<div id="login">
			<div id="login_b">
				<a id="putong" class="denglub_focus" onclick="pudeng()">普通登陆</a>
				<a id="wumidenglu" class="denglub" onclick="wumideng()">手机无密码登录</a>
			</div>
			{{msg}}
			<div id="tip">
				<div id="jgfh"></div>
				<span id="sjhe">请输入手机号</span>
				<span id="yzme">请输入验证码</span>
				<span id="zqsjh">手机号错误</span>
			</div>
			<div id="shuru">
				<input class="shoujihao" v-model="userInfo.u"  type="text" placeholder="用户名/邮箱/手机号" required="required"/>
				<input type="password"   v-model="userInfo.p"   placeholder="密码" required="required"/>
			</div>
			<div id="wumi">
				<input id="wumizh" class="shoujihao" type="text" placeholder="用户名/邮箱/手机号" required="required"/>
				<button id="send">获取动态密码</button>
				<input id="wumimima" type="text" placeholder="验证码" required="required"/>
			</div>
			<div>
				<input  @click="login()"    id="dl" type="button" value="登录"/>
			</div>
			<div id="weixindenglu">
				<a href="#"><img src="img/weixincai.png"/>微信登陆</a>
			</div>
			<div id="qita">
				<a id="wangji">忘记密码</a>
				<a id="mianzhu" href="zhuce.html">免费注册</a>
			</div>
		</div>
	</div>
	<div id="foot">
		<div id="foot_ys">
			<div id="erweima"><h4>美丽说客户端下载</h4><img src="img/kehuduan.png"/></div>
			<div id="erweima1"><h4>美丽说微信服务号</h4><img src="img/fuwuhao.jpg"/></div>
			<table>
				<tr id="title">
					<td>买家帮助</td>
					<td>商家帮助</td>
					<td>关于我们</td>
					<td>关注我们</td>
				</tr>
				<tr>
					<td>新手指南</td>
					<td>供货商招募</td>
					<td>关于美丽说</td>
					<td><div id="xinlang" class="guanzhu"></div>新浪微博</td>
				</tr>
				<tr>
					<td>服务保障</td>
					<td>商家后台</td>
					<td>联系我们</td>
					<td><div id="Qkongjian" class="guanzhu"></div>QQ空间</td>
				</tr>
				<tr>
					<td>常见问题</td>
					<td>规则中心</td>
					<td></td>
					<td><div id="tengxun" class="guanzhu"></div>腾讯微博</td>
				</tr>
				<tr>
					<td>风险监测</td>
					<td></td>
					<td></td>
					<td></td>
				</tr>
			</table>
		</div>
		<div id="footer">
			Copyright ©2017 Meilishuo.com
			<a href="#">电信与信息服务业务经营许可证100798号</a>
			<a href="#">经营性网站备案信息</a>
			<br />
            京ICP备11031139号 京公网安备110108006045 客服电话：400-8158-666 文明办网文明上网举报电话：010-82615762  
			<a href="#">违法不良信息举报中心</a>
		</div>
	</div>
	<script type="text/javascript" src="/meilishuo/js/jq.js"></script>
	<script type="text/javascript" src="/meilishuo/js/vue.js"></script>
	<script type="text/javascript">
	      var app = new Vue({
	    	  el:"#main",
	    	  data:{
	    		  userInfo:{},
	    		  msg:""
	    	  },
	    	  methods:{
	    		  login:function(){
	    			  //1 正则验证
	    			  //2发送请求到后台
	    			  $.post("/meilishuo/user/login",app.userInfo,function(backData){
	    				  if(backData.code==10012) { app.msg = backData.msg; }
	    				  if(backData.code==10013) {
	    					  //不一样
	    					  //获取当前地址栏是否有src  如果有 则跳转到src的路径 没有就去首页
	    					  var url = window.location.href.split("src=")[1];
	    					  if(url != undefined ) {
	    						  window.location.href = url;
	    					  }else{
	    						  window.location.href = "/meilishuo";
	    					  }
	    				  }
	    			  })
	    		  }
	    	  }
	      });
	
	
    </script>
 </body>
 
</html>
